<template>
  <div class="blogList">
    <div>
      <el-header style="position: relative">
        <span style="font-size: 30px;font-family: 'Agency FB';color: #55a1ff  "><i class="fa fa-check-circle-o"></i>&nbsp;&nbsp;外出申请审核 </span>
        <div style="position: absolute; right: 10px;top: 35px;">  <el-button icon="el-icon-refresh-right" round="true" @click="refresh()">点击刷新</el-button></div>
        <span class="radio" style="float: right">
      <el-radio-group v-model="reverse">
        <el-radio :label="true" >按申请时间倒序</el-radio>
        <el-radio :label="false">按申请时间正序</el-radio>
      </el-radio-group>

    </span>

      </el-header>
    </div>
    <el-divider>未审核外出申请列表</el-divider>
    <el-main style="overflow-y: scroll;max-height: 650px"  v-infinite-scroll="requestData">
      <div class="block">
        <el-timeline :reverse="reverse">
          <el-timeline-item  v-for="(item,index) in out" :timestamp="item.createTime" placement="top">
            <el-card>
              <!--confirm确认事件-->
              <el-popconfirm @confirm="checkNot(index)"
                             title="确定驳回申请吗?" style="float: right">
                <el-button size="large"
                           type="danger" slot="reference">驳回</el-button>
              </el-popconfirm>

              <!--confirm确认事件-->
              <el-popconfirm @confirm="isCheck(index)"
                             title="确定让这个申请通过审核吗?" style="">
                <el-button size="large"
                           type="primary" slot="reference">通过审核</el-button>
              </el-popconfirm>
              <h4>申请人: {{item.outName}}</h4>
              <h4>外出地点: {{item.outAddress}}</h4>
              <h4>外出时间: {{item.outStarttime}}</h4>
              <h4>回来时间: {{item.outEndtime}}</h4>
              外出理由:
              <p>{{item.outResult}}</p>


            </el-card>
          </el-timeline-item>

        </el-timeline>
      </div>
    </el-main>
  </div>
</template>

<script>
import {notCheck} from "@/api/admin_api";
import {checkTrue} from "@/api/admin_api";
import {checkFalse} from "@/api/admin_api";
import {VueJsonp} from "vue-jsonp";

export default {
  name: "blog_check",
  data(){
    return{
      reverse:true,
      value1: '',
      defaultDate:'2022-07-01',
      out:[
        {outName: '王杰',outAddress: '盘龙区',outResult: '去延安医院做手术',createTime: '2022-07-21 17:09:58',outStarttime: '2022-07-21 17:09:58',outEndTime:'2022-07-21 17:09:58'},
        {outName: '李华',outAddress: '五华区',outResult: '去买药',createTime: '2022-07-21 17:09:58',outStarttime: '2022-07-21 17:09:58',outEndTime:'2022-07-21 17:09:58'},
        {outName: '张章',outAddress: '盘龙区',outResult: '去延安医院做手术',createTime: '2022-07-21 17:09:58',outStarttime: '2022-07-21 17:09:58',outEndTime:'2022-07-21 17:09:58'},
      ],
      imgList:[],
      blogId:[],
      blogIndex:0,
    }
  },
  methods:{
    // 刷新
    refresh(){
      location.reload();
    },


    //请求三条数据
    // requestData(){
    //   let _this = this;
    //   if (_this.blogIndex<_this.blogId.length){
    //     for (let i = 0;i<2;i++){
    //       getBlog(_this.blogId[_this.blogIndex++]).then((res)=>{
    //         _this.blog.push(res.data.data)
    //       })
    //     }
    //   }
    // },


    // 修改申请为已审核
    isCheck(index){
      checkTrue(this.out[index].outId).then(()=>{
        this.out.splice(index,1);
      })
    },

    //驳回申请
    checkNot(index){
      checkFalse(this.out[index].outId).then(()=>{
        this.out.splice(index,1);
      })
    }


  },
  // 初始得到申请
  created() {

    notCheck().then((res)=>{
      this.out = res.data.data;
    })


  }


}
</script>

<style>


</style>